{extend name="public:base"}
{block name='css'}
<link href="__PUBLIC__/css/plugins/iCheck/custom.css" rel="stylesheet">
{/block}
{block name="js"}
<script src="__PUBLIC__/js/plugins/peity/jquery.peity.min.js"></script>
<script src="__PUBLIC__/js/content.min.js?v=1.0.0"></script>
<script type="text/javascript">
    function changeStatus(self) {
        if ($(self).hasClass('ed')) {
            return false;
        }

        var id = $(self).attr('data-id');
        var status = $(self).attr('data-status');

        $(self).addClass('ed');
        var obj = showMyLoading();
        $.post("{:url('changeStatus')}", {id:id,status:status}, function(data){
            hideMyLoading(obj);
            layer.msg(data.info);
            if (data.status == 'y') {
                if (status == 1) {
                    $(self).attr('class', 'btn btn-success btn-xs delete').attr('data-status', '0').text('是');
                } else {
                    $(self).attr('class', 'btn btn-danger btn-xs edit').attr('data-status', '1').text('否');
                }
            } else {
                $(self).removeClass('ed');
            }
        }, 'json');
    }
    function changeSale(self) {
        if ($(self).hasClass('ed')) {
            return false;
        }

        var id = $(self).attr('data-id');
        var status = $(self).attr('data-status');

        $(self).addClass('ed');
        var obj = showMyLoading();
        $.post("{:url('changeSale')}", {id:id,status:status}, function(data){
            hideMyLoading(obj);
            layer.msg(data.info);
            if (data.status == 'y') {
                if (status == 1) {
                    $(self).attr('class', 'btn btn-success btn-xs delete').attr('data-status', '0').text('是');
                } else {
                    $(self).attr('class', 'btn btn-danger btn-xs edit').attr('data-status', '1').text('否');
                }
            } else {
                $(self).removeClass('ed');
            }
        }, 'json');
    }

    function delAll(self){
        if ($(self).hasClass('ed')) {
            return false;
        }

        layer.confirm('真的要删除吗？删除后将无法找回！', {
            btn: ['确定','取消'] //按钮
        }, function(){
            myRequestRefresh(self, "{:url('delAll')}", $("#delRecord").serialize());
        }, function(){

        });
    }

    function del(self, id){
        if ($(self).hasClass('ed')) {
            return false;
        }

        layer.confirm('真的要删除吗？删除后将无法找回！', {
            btn: ['确定','取消'] //按钮
        }, function(){
            myRequestRefresh(self, "{:url('del')}", {id:id});
        }, function(){

        });
    }

    function sort(self){
        if ($(self).hasClass('ed')) {
            return false;
        }

        myRequestRefresh(self, "{:url('saveSort')}", $("#delRecord").serialize());
    }

    $(function(){
        //全选的实现
        $(".check-all").click(function(){
            $(".ids").prop("checked", this.checked);
        });
        $(".ids").click(function(){
            var option = $(".ids");
            option.each(function(i){
                if(!this.checked){
                    $(".check-all").prop("checked", false);
                    return false;
                }else{
                    $(".check-all").prop("checked", true);
                }
            });
        });

    });

</script>
{/block}
{block name='body'}
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>商品列表</h5>
                    <a href="{:url('save')}" class="btn btn-sm btn-primary pull-right m-t-n-xs">添加商品</a>
                </div>
                <div class="ibox-content">
                    <div class="row col-sm-12">
                        <div class="col-sm-1 m-b-xs">
                            <input type="submit" class="btn btn-sm btn-primary btn-sm btn-danger pull-left" onclick="delAll(this);return false;" value="删除"  />
                        </div>

                        <div class="col-sm-1">
                            <button type="button" onclick="window.location.reload();" id="loading-example-btn" class="btn btn-white btn-sm"><i class="fa fa-refresh"></i> 刷新</button>
                        </div>
                        <div class="col-sm-10 m-b-xs">
                            <form name="form" action="{:url('index')}"  method="get" >
                                <div class="col-sm-4 m-b-xs">
                                    <select name="cate_id" class="input-sm  form-control">
                                        <option value="">商品分类</option>
                                        {foreach name="clist" item="li"}
                                        <option value="{$li.id}" {if condition="$li.id eq input('cate_id')"}selected{/if}>{$li.title}</option>
                                        {notempty name='li.list'}
                                            {foreach name="li.list" item="son"}
                                            <option value="{$son.id}" {if condition="$son.id eq input('cate_id')"}selected{/if}>|-{$son.title}</option>
                                            {/foreach}
                                        {/notempty}
                                        {/foreach}
                                    </select>
                                </div>
                                <div class="col-sm-6">
                                    <div class="input-group pull-right">
                                        <input type="text" name="keywords" value="{:input('get.keywords')}" placeholder="商品名称" class="input-sm form-control"> <span class="input-group-btn">
                                        <button type="submit"  class="btn btn-sm btn-primary"> 搜索</button>
                                        <a href="{:url('index')}" class="btn btn-sm btn-warning"> 重置</a> </span>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    <form name="form" action=""  method="post" id="delRecord">
                        <table class="table table-bordered">
                            <thead>
                            <tr>
                                <th>
                                    <input class="check-all" type="checkbox" value="">
                                </th>
                                <th>分类</th>
                                <th>图片</th>
                                <th>名称</th>
                                <!-- <th>展示价格</th> -->
                                <th>单价</th>
                                <th>销量</th>
                                <th>是否推荐</th>
                                <th>是否销售</th>
                                <th>排序</th>
                                <th>操作</th>
                            </tr>
                            </thead>

                            {empty name="list"}
                            <tbody><tr><td colspan="10" style="text-align: center;">暂未查询到商品信息~</td></tr></tbody>
                            {else/}
                            <tbody>
                            {foreach name="list" item="li"}
                            <tr>
                                <td><input type="checkbox" class="ids" value="{$li.id}" name="id[]"></td>
                                <td>{$li.cate_title}</td>
                                <td><img src="{$li.img}" height="80"/></td>
                                <td>{$li.title}</td>
                                <!-- <td>{$li.price}</td> -->
                                <td>{$li.unit_price}</td>
                                <td>{$li.sale_num}</td>
                                <td>
                                    {eq name="li.is_recommend" value="1"}
                                    <a href="javascript:;" data-id="{$li.id}" data-status="0" onclick="changeStatus(this);" class="btn btn-success btn-xs">是</a>
                                    {else/}
                                    <a href="javascript:;" data-id="{$li.id}" data-status="1" onclick="changeStatus(this);" class="btn btn-danger btn-xs">否</a>
                                    {/eq}
                                </td>
                                <td>
                                    {eq name="li.is_sale" value="1"}
                                    <a href="javascript:;" data-id="{$li.id}" data-status="0" onclick="changeSale(this);" class="btn btn-success btn-xs">是</a>
                                    {else/}
                                    <a href="javascript:;" data-id="{$li.id}" data-status="1" onclick="changeSale(this);" class="btn btn-danger btn-xs">否</a>
                                    {/eq}
                                </td>
                                <td><input type="number"  style="width:60px;text-align:center;" name="{$li.id}" value="{$li.sort}" class="input-sm form-control"></td>
                                <td>
                                    <a href="{:url('save',['id'=>$li['id']])}" class="btn btn-success btn-xs edit"><i class="fa fa-edit"></i> 编辑</a>
                                    <a href="javascript:;" onclick="del(this, {$li.id});return false;" class="btn btn-danger btn-xs delete"><i class="fa fa-trash-o"></i> 删除</a>
                                </td>
                            </tr>
                            {/foreach}
                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="7">&nbsp;</td>
                                <td colspan="2">
                                    <button onclick="sort(this);return false;" class="btn btn-sm btn-primary m-t-n-xs" />修改排序</button>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="10" style="text-align:right;">{$list->render()}</td>
                            </tr>
                            </tfoot>
                            {/empty}


                        </table>
                    </form>
                </div>
            </div>
        </div>
    </div>

</div>

</body>
{/block}
